import React from 'react'
import style from './index.less'
import { connect } from 'dva';
import { Tabtitle } from '../../../../components'
import DefinitionList from '../../../../components/DefinitionList'
import { NoData } from '../../../../components'
import { Card, Row, Col } from 'antd'

/**
 * ClassRatio 分类占比  
 * 引用组件
 * TimeRangeSelect      时间区间
 * IndustrySelect       行业选择框
 * PortfolioAssets      组合资产
 * CategoryAssets       类别资产
 * IndustryDistribution 行业分布
 */

import TimeRangeSelect from '../../../../components/toolbar/TimeRangeSelect';
import PortfolioAssets from '../../../../routes/customerService/components/PortfolioAssets';
import CategoryAssets from '../../../../routes/customerService/components/CategoryAssets';
import IndustryDistribution from '../../../../routes/customerService/components/IndustryDistribution';

const ClassRatio = (props) => (
  <Card title="分类占比" className="classRatio">
    <TimeRangeSelect {...props} begindate={props.ratioBegindate} enddate={props.ratioEnddate} begindateName='ratioBegindate' enddateName='ratioEnddate' />
    <PortfolioAssets {...props} />
    <CategoryAssets {...props} />
    <IndustryDistribution {...props} />
  </Card>
)

/**
 * StockPosition 股票仓位
 * 子组件
 * StockPositionToolbar   股票仓位工具栏
 * 引用组件
 * PositionTrend  仓位走势
 * TopTenStocks   前十大重仓股票
 */
import PositionTrend from '../../../../routes/customerService/components/PositionTrend';
import TopTenStocks from '../../../../routes/customerService/components/TopTenStocks';

const StockPosition = (props) => (
  <Card title="股票仓位" className="stockPosition">
    <PositionTrend {...props} />
    <TopTenStocks {...props} />
  </Card>
)



/**
 * [ContentDisplay 查询结果图表展示]
 * 子组件 
 * ClassRatio 分类占比
 * StockPosition 股票仓位
 */
const ContentDisplay = (props) => (
  <div  className="dataArea">
    <ClassRatio  {...props} />
    <StockPosition  {...props} />
  </div>
)


/**
 * [HoldingAnalysis 持仓分析]
 */
const HoldingAnalysis = (props) => {

  const bench=props.benchList.length&&props.cBenchCode&&props.benchList.find(item=>item.productId==props.cBenchCode)||props.currentBench||''

  return (
    <div className={`${style.root}`}>
        {
           (props.lPortId && props.cBenchCode)?<ContentDisplay {...props}  benchName={bench&&bench.productName||''} />:<NoData />
        }
        
    </div>
  );
}

export default connect()(HoldingAnalysis)